<template>
  <div>
    <el-dialog
      title="登录日志"
      :visible.sync="loginLogDialog"
      width="width"
      @close="close"
    >
      <el-table :data="selAdminLogList" style="width: 100%">
        <el-table-column
          prop="addtime"
          label="时间"
          width="width"
          align="center"
        >
          <template slot-scope="scope">
            {{ scope.row.addtime | dateFormat }}
          </template>
        </el-table-column>
        <el-table-column
          prop="content"
          label="操作"
          width="width"
          align="center"
        >
        </el-table-column>
        <el-table-column
          prop="ip"
          label="IP"
          width="width"
          align="center"
        ></el-table-column>
        <el-table-column prop="ipAddr" label="IP归属地" width="width" align="">
        </el-table-column>
      </el-table>
      <el-row :gutter="10" style="margin-top: 10px" type="flex" justify="center">
        <el-pagination
          background
          :current-page="selAdminLogQuery.page"
          :page-sizes="[10, 20, 30,50]"
          :page-size="selAdminLogQuery.pageSize"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          layout="prev, pager, next"
          :total="total"
        >
        </el-pagination>
      </el-row>
    </el-dialog>
  </div>
</template>

<script>
import { selAdminLogApi } from "@/api/system";
export default {
  props: {
    loginLogDialog: {
      type: Boolean,
    },
  },
  data() {
    return {
      selAdminLogQuery: {
        page: 1,
        pageSize: 10,
        isLogin: 1,
      },
      total: "",
      selAdminLogList: [],
    };
  },
  created() {
    this.selAdminLog();
  },
  methods: {
    // 选择多少页码
    handleSizeChange(pageSize) {
      console.log(pageSize);
      this.selAdminLogQuery.pageSize = pageSize;
      this.selAdminLog();
    },
    // 选择当前页
    handleCurrentChange(page) {
      console.log(page);
      this.selAdminLogQuery.page = page;
      this.selAdminLog();
    },
    // 渲染
    async selAdminLog() {
      const res = await selAdminLogApi(this.selAdminLogQuery);
      console.log(res);
      this.selAdminLogList = res.records;
      this.total = res.total;
    },
    // 取消
    close() {
      this.$emit("update:loginLogDialog", false);
    },
  },
};
</script>

<style scoped></style>
